<!DOCTYPE html>
<html lang='zh-cn'>
<head>
  <meta charset='utf-8' />
  <meta http-equiv='X-UA-Compatible' content='IE=edge' />
  <meta
    name='viewport'
    content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'
  />
  <meta name='renderer' content='webkit' />
  <title></title>
  <link rel='stylesheet' href='/public/admin/css/pintuer.css' />
  <link rel='stylesheet' href='/public/admin/css/admin.css' />
  <script src='https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
  <script src='/public/admin/js/pintuer.js'></script>
</head>
<body>
<div class='panel admin-panel'>
  <div class='panel-head'>
    <strong class='icon-reorder'>管理员列表</strong>
    <a href='' style='float: right; display: none'>添加字段</a>
  </div>
  <div class='padding border-bottom'>
    <ul class='search' style='padding-left: 10px'>
      <li>
        <a
          class='button border-main icon-plus-square-o'
          href='/admin/admin/add'
        >
          添加管理员</a
        >
      </li>
      <li>搜索：</li>
      <li>
        <form method='GET'>
          <input
            type='search'
            placeholder='请输入管理员名称'
            value='<%= search %>'
            name='search'
            class='input'
            style='width: 250px; line-height: 17px; display: inline-block'
          />
          <button class='button border-main icon-search'>搜索</button>
        </form>
      </li>
    </ul>
  </div>
  <table class='table table-hover text-center'>
    <tr>
      <th width='100' style='text-align: left; padding-left: 20px'>ID</th>
      <th>管理员名</th>
      <th>注册时间</th>
      <th>状态</th>
      <th width='310'>操作</th>
    </tr>
    <% rows.forEach(item => { %>
    <tr>
      <td style='text-align: left; padding-left: 20px'><%= item.id %></td>
      <td><%= item.adminname %></td>
      <td><%= item.time %></td>
      <td>
        <% if(item.status == 0){ %>
        <a
          class='button border-green'
          href='javascript:;'
          onclick='status(this,<%= item.id %>,1)'
        >
          白名单</a
        >
        <% }else { %>
        <a
          class='button border-red'
          href='javascript:;'
          onclick='status(this,<%= item.id %>,0)'
        >黑名单</a
        >
        <% } %>
      </td>
      <td>
        <div class='button-group'>
          <a class='button border-main' href='admin/edit?id=<%= item.id %>'
          ><span class='icon-edit'></span> 修改</a
          >
          <a
            class='button border-red'
            href='javascript:void(0)'
            onclick='return del(this,<%= item.id %>)'
          ><span class='icon-trash-o'></span> 删除</a
          >
        </div>
      </td>
    </tr>
    <% }) %>
  </table>
</div>
</body>
<script>
  function status(obj, id, statu) {
    // 发送请求
    $.get(
      '/admin/admin/ajax_status',
      { id: id, status: statu },
      function(data) {
        // 判断是否执行成功
        if (data.success) {
          // 判断需要更改的状态
          if (+statu === 1) {
            $(obj)
              .parent()
              .html(
                `<a class='button border-red' href='javascript:;' onclick='status(this,${id},0)'> 黑名单</a>`,
              );
          } else {
            $(obj)
              .parent()
              .html(
                `<a class='button border-green' href='javascript:;' onclick='status(this,${id},1)'> 白名单</a>`,
              );
          }
        }
      },
    );
  }

  function del(obj, id) {
    // 确认框
    if (confirm('您确认要删除吗？')) {
      // 发送ajax请求删除
      $.get('/admin/admin/ajax_del', { id: id }, function(data) {
        // 判断是否删除成功
        if (data.success) {
          $(obj)
            .parents('tr')
            .remove();
        } else {
          alert('删除失败');
        }
      });
    }
  }
</script>
</html>
